<%@ page language="java" pageEncoding="UTF-8"%>
<%@ include file="../public.jsp"%>
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="Bookmark" href="favicon.ico">
<link rel="Shortcut Icon" href="favicon.ico" />

<link rel="stylesheet" type="text/css" href="${ctx }/css/H-ui.min.css" />
<link rel="stylesheet" type="text/css" href="${ctx }/css/H-ui.admin.css" />
<link rel="stylesheet" type="text/css" href="${ctx }/css/iconfont.css" />
<link rel="stylesheet" type="text/css"
	href="${ctx }/css/skin/default/skin.css" id="skin" />
<link rel="stylesheet" type="text/css" href="${ctx }/css/style.css" />
<!--[if IE 6]>
<script type="text/javascript" src="http://lib.h-ui.net/DD_belatedPNG_0.0.8a-min.js" ></script>
<script>DD_belatedPNG.fix('*');</script>
<![endif]-->
<!--/meta 作为公共模版分离出去-->

<title>角色管理 - 管理员管理 - H-ui.admin v3.0</title>
</head>
<body>
	<!--_header 作为公共模版分离出去-->
	<header class="navbar-wrapper">
		<div class="navbar navbar-fixed-top">
			<div class="container-fluid cl">
				<a class="logo navbar-logo f-l mr-10 hidden-xs">H-ui.admin</a> <span
					class="logo navbar-slogan f-l mr-10 hidden-xs">v3.0</span> <a
					aria-hidden="false" class="nav-toggle Hui-iconfont visible-xs"
					href="javascript:;">&#xe667;</a>
				<nav id="Hui-userbar"
					class="nav navbar-nav navbar-userbar hidden-xs">
					<ul class="cl">
						<li>超级管理员</li>
						<li class="dropDown dropDown_hover"><a href="#"
							class="dropDown_A">admin </a>
							<ul class="dropDown-menu menu radius box-shadow">
								<li><a href="javascript:;" onClick="myselfinfo()">个人信息</a></li>
								<li><a href="#">切换账户</a></li>
								<li><a href="#">退出</a></li>
							</ul></li>
						<li id="Hui-msg"><a href="#" title="消息"><span
								class="badge badge-danger">1</span>消息</a></li>
						<li id="Hui-skin" class="dropDown right dropDown_hover"><a
							href="javascript:;" class="dropDown_A" title="换肤">换肤</a>
							<ul class="dropDown-menu menu radius box-shadow">
								<li><a href="javascript:;" data-val="default"
									title="默认（黑色）">默认（黑色）</a></li>
								<li><a href="javascript:;" data-val="blue" title="蓝色">蓝色</a></li>
								<li><a href="javascript:;" data-val="green" title="绿色">绿色</a></li>
								<li><a href="javascript:;" data-val="red" title="红色">红色</a></li>
								<li><a href="javascript:;" data-val="yellow" title="黄色">黄色</a></li>
								<li><a href="javascript:;" data-val="orange" title="橙色">橙色</a></li>
							</ul></li>
					</ul>
				</nav>
			</div>
		</div>
	</header>
	<!--/_header 作为公共模版分离出去-->

	<!--_menu 作为公共模版分离出去-->
	<aside class="Hui-aside">

		<div class="menu_dropdown bk_2">

			<dl id="menu-admin">
				<dt class="selected">管理员管理</dt>
				<dd style="display: block;">
					<ul>
						<li class="current"><a href="/user/userlist" title="角色管理">角色管理</a></li>
					</ul>
				</dd>
			</dl>
		</div>
	</aside>
	<div class="dislpayArrow hidden-xs">
		<a class="pngfix" href="javascript:void(0);"
			onClick="displaynavbar(this)"></a>
	</div>
	<!--/_menu 作为公共模版分离出去-->

	<section class="Hui-article-box">
		<nav class="breadcrumb">
			首页 <span class="c-gray en">&gt;</span> 管理员管理 <span class="c-gray en">&gt;</span>
			角色管理 <a class="btn btn-success radius r"
				style="line-height: 1.6em; margin-top: 3px"
				href="javascript:location.replace(location.href);" title="刷新">刷新</a>
		</nav>
		<div class="Hui-article">
			<article class="cl pd-20">
				<div class="cl pd-5 bg-1 bk-gray">
					<span class="l"> <a href="javascript:;" onclick="datadel()"
						class="btn btn-danger radius">批量删除</a> <a
						class="btn btn-primary radius" href="javascript:;"
						onclick="admin_role_add('添加角色','${ctx }/user/adduser','400')">添加角色</a>
					</span> <span class="r">共有数据：<strong>54</strong> 条
					</span>
				</div>
				<div class="mt-10">
					<table
						class="table table-border table-bordered table-hover table-bg">

						<thead>
							<tr>
								<th scope="col" colspan="6">角色管理</th>
							</tr>
							<tr class="text-c">
								<th width="25"><input type="checkbox" value="" name=""></th>
								<th width="40">ID</th>
								<th width="200">角色名</th>
								<th width="300">描述</th>
								<th width="70">操作</th>
							</tr>
						</thead>

						<tbody>
							<c:forEach items="${roles }" var="role">
								<tr class="text-c">
									<td><input type="checkbox" value="" name=""></td>
									<td>${role.id }</td>
									<td>${role.name }</td>
									<td><a href="#">${role.desc }</a></td>
									<td class="f-14"><a title="编辑" href="javascript:;"
										onclick="admin_role_edit('角色编辑','${ctx }/user/adduser','1')"
										style="text-decoration: none">编辑</a> <a title="删除"
										href="javascript:;" onclick="admin_role_del(this,'1')"
										class="ml-5" style="text-decoration: none">删除</a></td>
								</tr>
							</c:forEach>
						</tbody>

					</table>
				</div>
			</article>
		</div>
	</section>

	<!--_footer 作为公共模版分离出去-->
	<script type="text/javascript" src="${ctx}/js/jquery.min.js"></script>
	<script type="text/javascript" src="${ctx}/js/layer.js"></script>
	<script type="text/javascript" src="${ctx}/js/H-ui.js"></script>
	<script type="text/javascript" src="${ctx}/js/H-ui.admin.page.js"></script>
	<!--/_footer /作为公共模版分离出去-->

	<!--请在下方写此页面业务相关的脚本-->
	<script type="text/javascript" src="${ctx}/js/jquery.dataTables.min.js"></script>
	<script type="text/javascript" src="${ctx}/js/laypage.js"></script>
	<script type="text/javascript">
		/*管理员-角色-添加*/
		function admin_role_add(title, url, w, h) {
			layer_show(title, url, w, 300);
		}
		/*管理员-角色-编辑*/
		function admin_role_edit(title, url, id, w, h) {
			layer_show(title, url, w, 300);
		}
		/*管理员-角色-删除*/
		function admin_role_del(obj, id) {
			layer.confirm('角色删除须谨慎，确认要删除吗？', function(index) {
				//此处请求后台程序，下方是成功后的前台处理……

				$(obj).parents("tr").remove();
				layer.msg('已删除!', {
					icon : 1,
					time : 1000
				});
			});
		}
	</script>
	<!--/请在上方写此页面业务相关的脚本-->
</body>
</html>